import deviceUtil from '../utils/device-util';

Component({
  /**
   * 组件的属性列表
   */
  options: {
    multipleSlots: true
  },
  properties: {
    // true：沉浸式状态栏；false：正常导航栏
    translucentBar: {
      type: Boolean,
      value: false
    },
    // 状态栏背景色，默认白色
    bgColor: {
      type: String,
      value: '#FFFFFF'
    },
    // 返回按钮图片 白色： /img/navbar/return.png 黑色：/img/navbar/return-black.png
    backIcon: {
      type: String,
      value: '/img/navbar/return-black.png'
    },

    // 返回按钮
    showBack: {
      type: Boolean,
      value: true
    },
    // 标题名称
    title: {
      type: String,
      value: ''
    },
    // 标题字体大小
    titleSize: {
      type: String,
      value: '36'
    },
    //标题颜色
    titleColor: {
      type: String,
      value: ''
    },


  },

  /**
   * 组件的初始数据
   */
  data: {
    statusBarHeight: deviceUtil.getStatusBarHeight(), // 状态栏的高度
    navigationBarHeight: deviceUtil.getNavigationBarHeight(), // 导航栏的高度
    opacity: 1,
  },
  lifetimes: {
    attached: function () {
      // 如果是沉浸式导航栏，一进入组件，导航栏透明度设置成 0 
      if (this.data.translucentBar) {
        this.setData({
          opacity: 0
        })
      }
    },

  },
  /**
   * 组件的方法列表
   */
  methods: {
    setOpacity(scrollTop, maxTop) {
      var opacity = 0
      if (scrollTop <= maxTop) {
        opacity = scrollTop / maxTop
        this.triggerEvent('onSetNavBg', false)
      } else {
        opacity = 1
        this.triggerEvent('onSetNavBg', true)
      }
      if (this.data.translucentBar) {
        this.setData({
          opacity: opacity
        })
      } else {
        this.setData({
          opacity: 1
        })
      }
    },
    // 返回按钮事件
    onBack() {
      wx.navigateBack()

    },
  }
})